<%-- 
    Document   : index
    Created on : May 18, 2013, 7:50:18 PM
    Author     : quannq
--%>

<%@page contentType="text/html" pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<script>

    var pageKM =${numPageKM};
    var numKM = 1;
    var pageKhac =${numPageKhac};
    var numKhac = 1;
    function get4NextKM() {

        numKM = numKM + 1;
        if (numKM > pageKM)
            numKM = 1;

        $.ajax({
            type: "get",
            url: "get4KM/" + numKM,
            success: function(response) {
                $(".km").html("");
                $(".km").html(response);
            },
            error: function() {
                alert('Error while request..');
            }
        });
    }
    function get4RevKM() {

        numKM = numKM - 1;
        if (numKM < 1)
            numKM = pageKM;

        $.ajax({
            type: "get",
            url: "get4KM/" + numKM,
            success: function(response) {
                $(".km").html("");
                $(".km").html(response);
            },
            error: function() {
                alert('Error while request..');
            }
        });
    }
    function get4NextKhac() {

        numKhac = numKhac + 1;
        if (numKhac > pageKhac)
            numKhac = 1;

        $.ajax({
            type: "get",
            url: "get4Khac/" + numKhac,
            success: function(response) {
                $(".khac").html("");
                $(".khac").html(response);
            },
            error: function() {
                alert('Error while request..');
            }
        });
    }
    function get4RevKhac() {

        numKhac = numKhac - 1;
        if (numKhac < 1)
            numKhac = pageKhac;

        $.ajax({
            type: "get",
            url: "get4Khac/" + numKhac,
            success: function(response) {
                $(".khac").html("");
                $(".khac").html(response);
            },
            error: function() {
                alert('Error while request..');
            }
        });
    }
</script>
<c:if test="${not empty SachKM}">
    <div class="p-module">

        <div class="p-module-header p-module-header-blue clearfix">
            <h3>
                <a href="#" style="float: left; text-decoration: none;">
                    Khuyến Mãi:
                    <span style="color:red;">Sách Phương Nam Book Giảm Giá</span>
                </a>
            </h3>
            <a class="tool-link" href="view-all-khuyen-mai/page/1">Xem tất cả</a>
        </div>


        <div class="p-module-body">
            <div class="p-product-list-1 products-slider">
                <input type="hidden" class="page_size" name="page_size" value="4"/>
                <div class="products-slider-viewport"><div class="products-slider-inner" style="position: relative; width: 750px; height: 253px; overflow: hidden; ">
                        <div class="products-page km" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 5; opacity: 1; ">

                            <c:forEach items="${SachKM}" var="sach">

                                <div class="product-one">   
                                    <div class="p-thumb" onmouseover="tooltip(${sach.masach});" >
                                        <a href="view-sach/${sach.masach}" title="">
                                            <img class="" src="${pageContext.request.contextPath}/image/sell/${sach.anhbia}" width="109" height="160" alt="${sach.tensach}" border="0"/>
                                        </a>
                                    </div>      
                                    <div>
                                        <h2>
                                            <a href="view-sach/${sach.masach}" title="${sach.tensach}">${sach.tensach}</a>
                                        </h2>

                                        <div class="p-price"><span><span id="sec_sell_price_69726">${sach.giabia}</span>&nbsp;VNĐ</span>
                                        </div>

                                        <div class="p-discount-percent">(Giảm ${sach.giamgia} %)</div>
                                    </div>
                                </div>

                            </c:forEach>

                        </div>
                    </div>
                </div>
                <a class="btn-prev kmprev" onclick="get4RevKM();" >undefined</a>
                <a class="btn-next kmnext" onclick="get4NextKM();">undefined</a>
            </div>
            <div class="cleardiv">
            </div>
        </div>
    </div>
</c:if>


<c:if test="${not empty SachKhac}">
    <div class="p-module">

        <div class="p-module-header p-module-header-blue clearfix">
            <h3>
                <a href="#" style="float: left; text-decoration: none;">
                    Sách Phương Nam Book
                </a>
            </h3>
            <a class="tool-link" href="view-all-khac/page/1">Xem tất cả</a>
        </div>


        <div class="p-module-body">
            <div class="p-product-list-1 products-slider">
                <input type="hidden" class="page_size" name="page_size" value="4"/>
                <div class="products-slider-viewport"><div class="products-slider-inner" style="position: relative; width: 750px; height: 253px; overflow: hidden; ">
                        <div class="products-page khac" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 5; opacity: 1; ">

                            <c:forEach items="${SachKhac}" var="sach">

                                <div class="product-one">   
                                    <div class="p-thumb" onmouseover="tooltip(${sach.masach});" >
                                        <a href="view-sach/${sach.masach}" title="">
                                            <img class="" src="${pageContext.request.contextPath}/image/sell/${sach.anhbia}" width="109" height="160" alt="${sach.tensach}" border="0"/>
                                        </a>
                                    </div>      
                                    <div>
                                        <h2>
                                            <a href="view-sach/${sach.masach}" title="${sach.tensach}">${sach.tensach}</a>
                                        </h2>

                                        <div class="p-price"><span><span id="sec_sell_price_69726">${sach.giabia}</span>&nbsp;VNĐ</span>
                                        </div>

                                    </div>
                                </div>

                            </c:forEach>

                        </div>
                    </div>
                </div>
                <a class="btn-prev khacpre" onclick="get4RevKhac();" >undefined</a>
                <a class="btn-next khacnext" onclick="get4NextKhac();"n>undefined</a>
            </div>
            <div class="cleardiv">
            </div>
        </div>
    </div>
</c:if>

<c:if test="${not empty SachBanChay}">
    <div class="p-module">

        <div class="p-module-header p-module-header-blue clearfix">
            <h3>
                <a href="#" style="float: left; text-decoration: none;">
                    Sách Phương Nam Book Bán Chạy
                </a>
            </h3>
            <a class="tool-link" href="#">Xem tất cả</a>
        </div>


        <div class="p-module-body">
            <div class="p-product-list-1 products-slider">
                <input type="hidden" class="page_size" name="page_size" value="4"/>
                <div class="products-slider-viewport"><div class="products-slider-inner" style="position: relative; width: 750px; height: 253px; overflow: hidden; ">
                        <div class="products-page km" style="position: absolute; top: 0px; left: 0px; display: block; z-index: 5; opacity: 1; ">

                            <c:forEach items="${SachBanChay}" var="sach">

                                <div class="product-one">   
                                    <div class="p-thumb" >
                                        <a href="view-sach/${sach.masach}" title="">
                                            <img class="" src="${pageContext.request.contextPath}/image/sell/${sach.anhbia}" width="109" height="160" alt="${sach.tensach}" border="0"/>
                                        </a>
                                    </div>      
                                    <div>
                                        <h2>
                                            <a href="view-sach/${sach.masach}" title="${sach.tensach}">${sach.tensach}</a>
                                        </h2>

                                        <div class="p-price"><span><span id="sec_sell_price_69726">${sach.giabia}</span>&nbsp;VNĐ</span>
                                        </div>
                                        <c:if test="${sach.giamgia>0}"> 
                                            <div class="p-discount-percent">(Giảm ${sach.giamgia} %)</div>
                                        </c:if>
                                    </div>
                                </div>

                            </c:forEach>

                        </div>
                    </div>
                </div>
                <a class="btn-prev kmprev" onclick="get4Rev();" >undefined</a>
                <a class="btn-next kmnext" onclick="get4Next();">undefined</a>
            </div>
            <div class="cleardiv">
            </div>
        </div>
    </div>
</c:if>
